<template>
	<div class="addGoodBox">
		<u-popup v-model="visiable" mode="right">
			<view>
				<view class="top">
					<view class="">{{type=='add'?'添加':'编辑'}}门店</view>
					<image @click="close" src="https://www.yongshantuan.cn/images/yongshan/platformSide/cha.png"
						mode=""></image>
				</view>
				<view class="content">
					<view class="list">
						<view class="title">门店logo</view>
						<view class="uploadContent">
							<u-upload ref="uUpload" :auto-upload="false" :fileList="fileList"
								:max-size="1 * 1024 * 1024" max-count="1" :show-progress="false">
							</u-upload>
						</view>
					</view>
					<view class="list">
						<view class="title">门店描述</view>
						<view class="inputContent">
							<u-input type="text" v-model="storeInfo.storeDescription" placeholder="请输入门店描述"></u-input>
						</view>
					</view>
					<view class="list">
						<view class="title">门店名称</view>
						<view class="inputContent">
							<u-input type="text" v-model="storeInfo.storeName" placeholder="请输入门店名称" :clearable="false">
							</u-input>
						</view>
					</view>
					<view class="list">
						<view class="title">门店菜品合作单价</view>
						<view class="priceContent">
							<view class="alerdySelect">
								<view class="" v-for="(item,index) in storeInfo.storeUnitPriceList" :key="index">
									{{item.num}}元
								</view>
							</view>
							<view class="addPriceControl">
								<view>
									<u-input type="text" placeholder="输入商店可选价格" :clearable="false"
										v-model="customPrice" />
								</view>
								<image src="https://www.yongshantuan.cn/images/yongshan/platformSide/add.png" mode=""
									@click="addPrice">
								</image>
							</view>
						</view>
					</view>
					<view class="list spec">
						<view class="title">是否允许用户自定义价格</view>
						<u-checkbox @change="priceCheckChange" v-model="storeInfo.customPriceFlag"></u-checkbox>
					</view>

					<view class="list addTimeList">
						<view class="title">营业时间</view>
						<!-- 二期放开 -->
						<!-- <view class="" @click="addTimeList">
							点击新增
						</view> -->
					</view>
					<view class="list timeList" v-for="(item,index) in timeList" :key="index">
						<view class="inputContent">
							<u-input type="text" :disabled="false" @click="showTimePicker(index,'startTime')"
								v-model="item.startTime" placeholder="请选择开始时间"></u-input>
						</view>
						-
						<view class="inputContent">
							<u-input type="text" :disabled="false" @click="showTimePicker(index,'endTime')"
								v-model="item.endTime" placeholder="请选择结束时间"></u-input>
						</view>
					</view>

					<!-- <view class="list">
						<view class="title">门店上午开始营业时间</view>
						<view class="inputContent">
							<u-input type="text" :disabled="true" @click="showTimePicker('startTime')"
								v-model="storeInfo.businessHoursBegin" placeholder="请选择时间"></u-input>
						</view>
					</view>
					<view class="list">
						<view class="title">门店上午结束营业时间</view>
						<view class="inputContent">
							<u-input type="text" :disabled="true" @click="showTimePicker('endTime')"
								v-model="storeInfo.businessHoursEnd" placeholder="请选择时间"></u-input>
						</view>
					</view>

					<view class="list">
						<view class="title">门店下午开始营业时间</view>
						<view class="inputContent">
							<u-input type="text" :disabled="true" @click="showTimePicker('afterStartTime')"
								v-model="storeInfo.afternoonHoursBegin" placeholder="请选择时间"></u-input>
						</view>
					</view>
					<view class="list">
						<view class="title">门店下午结束营业时间</view>
						<view class="inputContent">
							<u-input type="text" :disabled="true" @click="showTimePicker('afterEndTime')"
								v-model="storeInfo.afternoonHoursEnd" placeholder="请选择时间"></u-input>
						</view>
					</view> -->

					<view class="list">
						<view class="title">门店资质上传</view>
						<view class="uploadContent">
							<u-upload ref="qualificationsUploads" :auto-upload="false"
								:fileList="qualificationsFileList" :max-size="20 * 1024 * 1024" max-count="6"
								:show-progress="false">
							</u-upload>
						</view>
					</view>
					<view class="list">
						<view class="title">门店登录账号</view>
						<view class="inputContent">
							<u-input type="text" v-model="storeInfo.loginAccount" placeholder="请填写门店登录账号"></u-input>
						</view>
					</view>
					<view class="list">
						<view class="title">门店登录密码</view>
						<view class="inputContent">
							<u-input type="text" v-model="storeInfo.pass" placeholder="请填写门店登录密码"></u-input>
						</view>
					</view>
					<view class="list">
						<view class="fractionContent">
							<view class="">
								<view class="">包装</view>
								<u-input placeholder="填写分数" :clearable="false" v-model="storeInfo.packagingScore">
								</u-input>
							</view>
							<view class="">
								<view class="">份量</view>
								<u-input placeholder="填写分数" :clearable="false" v-model="storeInfo.componentScore">
								</u-input>
							</view>
							<view class="">
								<view class="">口味</view>
								<u-input placeholder="填写分数" :clearable="false" v-model="storeInfo.flavorScore">
								</u-input>
							</view>
						</view>
					</view>
					<!-- <view class="list">
						<view class="title">排序</view>
						<view class="inputContent">
							<u-input type="text" v-model="storeInfo.sort" placeholder="请填写序号" :clearable="false">
							</u-input>
						</view>
					</view> -->
					<view class="list">
						<view class="title">主营品类</view>
						<view class="inputContent">
							<u-input type="text" :disabled="false" placeholder="请选择品类" @click="showSelects('spec')"
								v-model="storeInfo.mainSpec"></u-input>
							<image class="arrow"
								src="https://www.yongshantuan.cn/images/yongshan/platformSide/downArrow.png" mode="">
							</image>
						</view>
					</view>
					<view class="list">
						<view class="title">所属站点</view>
						<view class="inputContent">
							<u-input type="text" :disabled="false" placeholder="请选择站点" @click="showSelects('posi')"
								v-model="storeInfo.posi"></u-input>
							<image class="arrow"
								src="https://www.yongshantuan.cn/images/yongshan/platformSide/downArrow.png" mode="">
							</image>
						</view>
					</view>
					<!--  -->
					<view class="siteContent" v-if="storeInfo.posi">
						<view class="" v-for="(item,index) in siteSortList" :key="index">
							{{item.siteName}}：<u-input type="text" v-model="item.sort" placeholder=""
								:clearable="false"></u-input>
						</view>
					</view>
					<view class="commenButton" @click="addStore">保存</view>
				</view>
			</view>
		</u-popup>
		<view class="selectBox">
			<u-popup mode="bottom" v-model="showSelect" @touchmove.stop.prevent="" :closeable="true">
				<view class="selectContent">
					<view class="title">{{selectTitle}}</view>
					<view class="selList" v-for="(item,index) in tempList" :key="index" @click="selectThis(index)">
						<label v-if="selectType=='posi'">
							<checkbox :checked="item.checked" /><text></text>
						</label>
						<view class="">
							{{item.name}}
						</view>
					</view>
				</view>
			</u-popup>
		</view>
		<u-picker v-model="showTime" mode="time" :params="params" @confirm="confirm"></u-picker>
		<u-toast ref="uToast"></u-toast>
	</div>
</template>

<script>
	import {
		getMainCategories,
		getPosiList,
		createStore,
		editStore,
	} from '@/utils/req/api.js'
	export default {
		props: ['show', 'type', 'editStoreInfo'],
		data() {
			return {
				aaa: '',

				visiable: false,
				fileList: [], //门店logo数组
				qualificationsFileList: [], //门店资质数组
				qualificationsTempList: [], //门店资质临时存储数组
				// mainCategorieList: [], //主营分类数组
				specCheck: '',
				storeInfo: {
					logo: '',
					storeDescription: '',
					storeName: '',
					customPriceFlag: false,
					storeUnitPriceList: [],
					storeUnitPrice: '10',
					businessHoursBegin: '',
					businessHoursEnd: '',
					qualifications: '', //门店资质

					loginAccount: '',
					packagingScore: '', //包装评分
					componentScore: '', //分量评分
					flavorScore: '', //口味评分
					sort: '',
					mainSpec: '',
					mainCategoriesId: '',
					posi: '',
					siteId: ''
				},
				customPrice: '', //自定义价格
				showSelect: false, //展示下拉picker
				selectType: '', //下拉picker的触发类别
				selectTitle: '', //下拉picker的提示标题
				tempList: [],

				showTime: false, //展示时间picker
				timeIndex: '',
				timeType: '',
				timeList: [{
						startTime: '',
						endTime: '',
					},
					{
						startTime: '',
						endTime: '',
					},
					{
						startTime: '',
						endTime: '',
					},
				],
				params: {
					hour: true,
					minute: true,
					second: false
				},
				mainCategorieList: [],
				posiList: [],

				submitFlag: false,
				ids: [], //选中的站点id集合
				selectRow: [], //选中的站点对象集合,


				siteSortList: []
			}
		},
		methods: {
			addTimeList() {
				this.timeList.push({
					startTime: '',
					endTime: ''
				})
			},

			async getMainCategories() {
				let res = await getMainCategories();
				this.mainCategorieList = res.data.result
				console.log('0-------', this.type)
				if (this.type == 'edit') {
					this.setEditInfo()
				} else {
					this.timeList[0].startTime = '19:00'
					this.timeList[0].endTime = '10:10'
				}
			},
			async getPosiList() {
				let res = await getPosiList();
				this.posiList = res.data.result.records;
				this.posiList.forEach(item => {
					item.checked = false;
				})

				this.getMainCategories();
			},
			priceCheckChange(e) {
				this.storeInfo.customPriceFlag = e.value;
			},

			close() {
				this.$emit('hideBox')
			},
			showSelects(type) {
				console.log('我报错了', this.storeInfo)
				this.selectType = type;
				if (type == 'spec') {
					this.selectTitle = '请选择品类';
					this.tempList = this.mainCategorieList;
				} else if (type == 'posi') {
					this.selectTitle = '请选择站点';
					this.tempList = this.posiList;
				}
				this.showSelect = true
			},
			selectThis(index) {
				if (this.selectType == 'spec') {
					this.storeInfo.mainSpec = this.tempList[index].name;
					this.storeInfo.mainCategoriesId = this.tempList[index].id;

					this.showSelect = false;
				} else if (this.selectType == 'posi') {
					this.posiList[index].checked = !this.posiList[index].checked;
					this.ids = [];
					this.selectRow = [];
					// let tempArr = [];

					if (this.posiList[index].checked) {
						this.siteSortList.push({
							siteId: this.posiList[index].id,
							siteName: this.posiList[index].name,
							sort: ''
						})
					} else {
						let siteId = this.posiList[index].id;
						let tempList = [];
						this.siteSortList.forEach((item, siteIndex) => {
							if (item.siteId != siteId) {
								tempList.push(item)
							}
						})
						this.siteSortList = tempList
					}

					this.posiList.forEach(item => {
						if (item.checked) {
							this.ids.push(item.id)
							this.selectRow.push(item)
						}
					})
					// console.log(this.ids, 'this.ids');

					let tempArr = [];
					this.siteSortList.forEach(item => {
						tempArr.push(item.siteName)
					})
					this.storeInfo.posi = tempArr.join(',');
				}
			},
			addPrice() {
				if (!this.customPrice) {
					this.$showToast.call(this, '请填写价格', 'warning');
					return;
				}
				this.storeInfo.storeUnitPriceList.push({
					num: this.customPrice
				})
				this.customPrice = ''
			},
			//展示时间选择picker
			showTimePicker(index, type) {
				this.timeIndex = index;
				this.timeType = type;
				this.showTime = true;
			},
			//时间选择picker确认选择
			confirm(e) {
				let time = e.hour + ':' + e.minute;
				this.$set(this.timeList[this.timeIndex], this.timeType, time)
			},

			async addStore() {
				if (this.$refs.uUpload.lists == 0) {
					this.$emit('showToast', '请上传您的门店logo', 'warning');
					return;
				}
				// if (!this.storeInfo.storeDescription) {
				// 	this.$emit('showToast', '请填写门店描述', 'warning');
				// 	return;
				// }
				if (!this.storeInfo.storeName) {
					this.$emit('showToast', '请填写门店名称', 'warning');
					return;
				}
				console.log('this.storeInfo.customPriceFlag', this.storeInfo.customPriceFlag)
				console.log('this.storeInfo.storeUnitPrice', this.storeInfo.storeUnitPrice)
				if (!this.storeInfo.customPriceFlag) {
					if (!this.storeInfo.storeUnitPrice || this.storeInfo.storeUnitPrice.length == 0) {
						this.$emit('showToast', '请选择门店可选择价格', 'warning');
						return;
					}
				}
				if (!this.storeInfo.pass) {
					this.$emit('showToast', '请输入商户的登录密码', 'warning');
					return;
				}
				if (/[\u4E00-\u9FA5\uFE30-\uFFA0]/.test(this.storeInfo.pass)) {
					this.$emit('showToast', '商户登录密码不能包含中文', 'warning');
					return;
				}
				// if (!this.storeInfo.businessHoursBegin) {
				// 	this.$emit('showToast', '请填写门店开始营业时间', 'warning');
				// 	return;
				// }
				// if (!this.storeInfo.businessHoursEnd) {
				// 	this.$emit('showToast', '请填写门店结束营业时间', 'warning');
				// 	return;
				// }
				// if (new Date(this.storeInfo.businessHoursBegin).getTime() > new Date(this.storeInfo.businessHoursEnd)
				// 	.getTime()) {
				// 	this.$emit('showToast', '门店开始营业时间不能晚于门店结束时间', 'warning');
				// 	return;
				// }

				if (!this.timeList[0].startTime || !this.timeList[0].endTime) {
					this.$emit('showToast', '请至少选择一个完成的营业时间段', 'warning');
					return;
				}
				let flag = false;
				for (let i = 0; i < this.timeList.length; i++) {
					if (this.timeList[i].startTime && this.timeList[i].endTime) {
						if (this.timeList[i].startTime == this.timeList[i].endTime) {
							console.log(this.timeList[i].startTime, this.timeList[i].endTime)
							flag = true;
							break;
						}
					}
				}
				if (flag) {
					this.$emit('showToast', '开始营业时间和结束营业时间不能一样', 'warning');
					return;
				}
				// if (this.$refs.qualificationsUploads.lists == 0) {
				// 	this.$emit('showToast', '请上传门店资质图片', 'warning');
				// 	return;
				// }
				if (!this.storeInfo.loginAccount) {
					this.$emit('showToast', '请填写门店登录账号', 'warning');
					return;
				}
				// if (!this.storeInfo.sort) {
				// 	this.$emit('showToast', '请填写门店排序', 'warning');
				// 	return;
				// }
				if (this.storeInfo.packagingScore > 5) {
					this.$emit('showToast', '门店包装评分5分最高', 'warning');
					return;
				}
				if (!this.storeInfo.packagingScore) {
					this.$emit('showToast', '请填写门店包装评分', 'warning');
					return;
				}
				if (this.storeInfo.componentScore > 5) {
					this.$emit('showToast', '门店份量评分5分最高', 'warning');
					return;
				}
				if (!this.storeInfo.componentScore) {
					this.$emit('showToast', '请填写门店份量评分', 'warning');
					return;
				}
				if (this.storeInfo.flavorScore > 5) {
					this.$emit('showToast', '门店口味评分5分最高', 'warning');
					return;
				}
				if (!this.storeInfo.flavorScore) {
					this.$emit('showToast', '请填写门店口味评分', 'warning');
					return;
				}
				if (this.siteSortList.length == 0) {
					this.$emit('showToast', '请至少选择一个站点', 'warning');
					return;
				}
				if (this.submitFlag) {
					return;
				}
				this.submitFlag = true;

				if (this.type == 'add') {
					let res = await this.$uploadFile(this.$refs.uUpload.lists[0].url);
					let {
						success,
						message
					} = JSON.parse(res.data)
					if (success) {
						this.storeInfo.logo = message;
					}
					if (this.$refs.qualificationsUploads.lists.length == 0) {
						this.submit();
					} else {
						this.$refs.qualificationsUploads.lists.forEach(async item => {
							let upRes = await this.$uploadFile(item.url);
							if (JSON.parse(upRes.data).success) {
								this.qualificationsTempList.push(JSON.parse(upRes.data).message)
							}
						})
					}

				} else if (this.type == 'edit') {
					if (this.$refs.uUpload.lists[0].url.indexOf('blob:') != -1) {
						let res = await this.$uploadFile(this.$refs.uUpload.lists[0].url);
						let {
							success,
							message
						} = JSON.parse(res.data)
						if (success) {
							this.storeInfo.logo = message;
						}
					} else {
						this.storeInfo.logo = this.$refs.uUpload.lists[0].url.split(getApp().globalData.BASE_IMG_URL)[
							1];
					}
					if (this.$refs.qualificationsUploads.lists.length == 0) {
						this.submit();
					} else {
						this.qualificationsTempList=[];
						this.$refs.qualificationsUploads.lists.forEach(async item => {
							if (item.url.indexOf('blob:') != -1) {
								let res = await this.$uploadFile(item.url);
								let {
									success,
									message
								} = JSON.parse(res.data)
								if (success) {
									this.qualificationsTempList.push(message)
								}
							} else {
								this.qualificationsTempList.push(item.url.split(getApp().globalData
									.BASE_IMG_URL)[1])
							}
						})
					}
				}
			},
			async submit() {
				console.log('111111')
				console.log(this.storeInfo);
				let tempArr = [];
				let storeUnitPriceList = this.storeInfo.storeUnitPriceList;
				if (this.customPrice) {
					storeUnitPriceList.push({
						num: this.customPrice
					})
				}
				if (storeUnitPriceList) {
					storeUnitPriceList.forEach(item => {
						tempArr.push(item.num);
					})
				}
				console.log('customPriceFlag', this.storeInfo.customPriceFlag)
				this.storeInfo.customPriceFlag = this.storeInfo.customPriceFlag || this.storeInfo
					.customPriceFlag ? '是' : '否';
				console.log('customPriceFlag', this.storeInfo.customPriceFlag)
				this.storeInfo.storeUnitPrice = JSON.stringify(tempArr);
				this.storeInfo.qualifications = this.qualificationsTempList.join(',');
				this.storeInfo.siteId = this.ids.join(',');
				this.storeInfo.businessHours = JSON.stringify(this.timeList);
				this.storeInfo.hcSiteRelationList = this.siteSortList;
				let res;
				if (this.type == 'add') {
					res = await createStore(this.storeInfo);
				} else if (this.type == 'edit') {
					res = await editStore(this.storeInfo);
				}
				if (res.data.success) {
					this.$emit('showToast', this.type == 'add' ? '门店添加成功' : '门店编辑成功', 'success');
					this.$emit('hideBox');
					this.submitFlag = false;
				} else {
					this.$emit('showToast', res.data.message, 'warning');
					// this.qualificationsTempList = [];
				}
			},
			//编辑时自动回显
			setEditInfo() {
				console.log('编辑时自动回显', this.editStoreInfo)
				let logo;
				this.fileList.push({
					url: this.editStoreInfo.logo.indexOf('http') == -1 ? getApp().globalData.BASE_IMG_URL + this
						.editStoreInfo.logo : this.editStoreInfo.logo
				})
				if (this.editStoreInfo.qualifications) {
					this.editStoreInfo.qualifications.split(',').forEach(item => {
						this.qualificationsFileList.push({
							url: item.indexOf('http') == -1 ? getApp().globalData.BASE_IMG_URL + item :
								item
						})
					})
				}

				if (this.editStoreInfo.storeUnitPrice) {
					this.editStoreInfo.storeUnitPriceList = [];
					this.editStoreInfo.storeUnitPrice.forEach(item => {
						this.editStoreInfo.storeUnitPriceList.push({
							num: item
						})
					})
				}

				// this.editStoreInfo.customPriceFlag = this.editStoreInfo.customPriceFlag == 'true' ? '是' : '否'
				this.mainCategorieList.forEach((item, index) => {
					if (item.id == this.editStoreInfo.mainCategoriesId) {
						this.editStoreInfo.mainSpec = item.name
					}
				})
				this.editStoreInfo.posi = this.editStoreInfo.siteName;
				this.editStoreInfo.siteId = this.editStoreInfo.siteId;
				//此处为了排除站点id和站点名称有一个没值的情况，正常情况不应该出现
				if (this.editStoreInfo.hcSiteRelationList.length != 0) {
					let tempSiteArr = [];
					this.editStoreInfo.hcSiteRelationList.forEach((item, index) => {
						if (item.siteId && item.siteName) {
							console.log(item.siteId, item.siteName)
							tempSiteArr.push(item)
						}
					})
					this.siteSortList = tempSiteArr;
				} else {
					this.siteSortList = []
				}

				this.posiList.forEach(item => {
					if (this.editStoreInfo.siteId.indexOf(item.id) != -1) {
						item.checked = true
						this.ids.push(item.id)
						this.selectRow.push(item)
					}
				})
				console.log('9999')

				this.editStoreInfo.customPriceFlag = this.editStoreInfo.customPriceFlag == '是' ? true : false;
				this.storeInfo = JSON.parse(JSON.stringify(this.editStoreInfo));
				console.log('666666', this.editStoreInfo.businessHours)
				//默认三个时间
				this.timeList = JSON.parse(this.editStoreInfo.businessHours);
				if (this.timeList.length < 3) {
					for (let i = 0; i < 3 - this.timeList.length; i++) {
						this.timeList.push({
							startTime: '',
							endTime: ''
						});
					}
				}

				this.$forceUpdate()
			},
			cleadrData() {
				console.log('触发了', this.$refs.uUpload.lists)
				this.$refs.uUpload.lists = [];
				this.$refs.qualificationsUploads.lists = [];
				this.timeList = [];
				this.siteSortList = []
				this.$nextTick(() => {
					this.storeInfo = {};
					this.fileList = [];
					this.qualificationsFileList = [];
				})
				this.$forceUpdate()
				console.log('8888', this.type)
			},
		},
		watch: {
			show(newVal) {
				if (newVal) {
					this.getPosiList();
				}

				this.visiable = newVal;
			},
			visiable(newVal) {
				console.log('newVal', newVal);
				console.log('siteSortList', this.siteSortList)
				if (!newVal) {
					this.cleadrData()
					this.$emit('hideBox');
				}
			},
			//监控门店资质图片上传进度--等图片上传完成之后才进行保存
			qualificationsTempList(newVal) {
				if (newVal.length == this.$refs.qualificationsUploads.lists.length) {
					console.log('????')
					this.submit();
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.top {
		@include flex(space-between, center);
		font-size: 28rpx;
		font-weight: bold;
		line-height: 2;
		padding: 10rpx 32rpx;
		background-color: #FF9C40;
		color: #fff;

		image {
			width: 20rpx;
			height: 20rpx;
		}
	}

	.content {
		padding: 40rpx 32rpx;

		.list {
			margin-bottom: 48rpx;

			.title {
				font-size: 24rpx;
				line-height: 1;
				margin-bottom: 16rpx;
			}

			.inputContent {
				position: relative;

				.arrow {
					width: 20rpx;
					height: 20rpx;
					position: absolute;
					right: 34rpx;
					top: calc((100% - 20rpx) / 2);
				}
			}

			.priceContent {
				>.alerdySelect {
					@include flex();
					flex-wrap: wrap;
					margin-bottom: 20rpx;

					>view {
						font-size: 28rpx;
						line-height: 40rpx;
						padding: 24rpx 40rpx;
						background-color: #f5f5f5;
						border-radius: 12rpx;
						margin-right: 20rpx;
						margin-bottom: 10rpx
					}
				}

				.addPriceControl {
					@include flex();

					>.custom {
						width: 196rpx;
						height: 88rpx;
						padding: 24rpx 0;

						/deep/.u-input__input {
							font-size: 28rpx;
							line-height: 40rpx;
							height: 40rpx;
							min-height: auto !important;
							text-align: center;
						}
					}

					image {
						width: 40rpx;
						height: 40rpx;
						margin-left: 20rpx;
					}
				}


			}

			.fractionContent {
				@include flex(space-between, center);

				>view {
					width: 28%;

					>view {
						&:nth-child(1) {
							font-size: 24rpx;
							line-height: 1;
							margin-bottom: 16rpx;
						}
					}
				}
			}
		}

		.addTimeList {
			@include flex(space-between, center);
			margin-bottom: 0;

			>view:nth-child(2) {
				background-color: #FA690A;
				color: #fff;
				border-radius: 5rpx;
				font-size: 28rpx;
				line-height: 1.5;
				padding: 0 10rpx;
			}
		}

		.timeList {
			@include flex(space-between, center);

			>view {
				width: 45%
			}
		}

		.siteContent {
			@include flex();
			flex-wrap: wrap;
			margin-bottom: 48rpx;

			>view {
				font-size: 28rpx;
				margin-right: 20rpx;
				@include flex(flex-start, center);
				margin-bottom: 20rpx;

				/deep/.u-input__input {
					font-size: 28rpx;
					line-height: 40rpx;
					height: 40rpx;
					min-height: auto !important;
					text-align: center;
				}
			}
		}

		.commenButton {
			background-color: #FA690A
		}

		.spec {
			@include flex();

			>view:nth-child(1) {
				margin-bottom: 0;
				line-height: 70rpx;
			}

			.u-checkbox {
				margin-left: 20rpx;
			}

			/deep/.u-checkbox__icon-wrap {
				border-radius: 50%;
			}

			/deep/.u-checkbox__icon-wrap--checked {
				background-color: #FA690A !important;
				border: 1px solid #FA690A !important;
			}

			&:nth-child(2) {
				font-size: 24rpx;
				color: #FA690A;
			}

		}
	}

	.selectContent {
		.title {
			font-size: 32rpx;
			line-height: 2;
			font-weight: bold;
			text-align: center;
		}

		.selList {
			border-bottom: 1px solid rgba(0, 0, 0, 0.05);
			font-size: 28rpx;
			line-height: 40rpx;
			padding: 24rpx 0;
			@include flex();

			&:last-child {
				border-bottom: 0;
			}

			/deep/.uni-checkbox-input {
				border-radius: 50%;
				width: 36rpx;
				height: 36rpx;
				border-color: #FA690A !important;
				margin-right: 16rpx !important;
			}

			/deep/.uni-checkbox-input-checked {
				border-color: #FA690A !important;

				&:before {
					content: '';
					width: 30rpx;
					height: 30rpx;
					background-color: #FA690A;
					border-radius: 50%;
					display: block;
				}
			}
		}
	}
</style>
<style lang="scss">
	uni-modal {
		z-index: 9999999 !important
	}

	.addGoodBox {
		/deep/.u-drawer-bottom {
			width: 100% !important;
			padding: 36rpx 20rpx 40rpx 20rpx;
			border-top-left-radius: 40rpx;
			border-top-right-radius: 40rpx;
			min-height: 30vh;
		}
	}

	.list {
		/deep/.u-input__input {
			background-color: #F5F5F5;
			font-size: 28rpx;
			padding: 0 28rpx;
		}
	}

	.siteContent {
		/deep/.u-input__input {
			width: 80rpx;
			background-color: #F5F5F5;
			font-size: 28rpx;
			padding: 0 28rpx;
		}
	}

	.uploadContent {
		/deep/.u-list-item {
			margin-left: 0 !important;
		}
	}

	//添加商品组件的部分样式
	.addGoodBox {
		/deep/.u-drawer-right {
			width: 85% !important;
		}
	}

	.selectBox {
		/deep/.u-drawer-bottom {
			width: 100% !important;
			padding: 36rpx 20rpx 40rpx 20rpx;
			border-top-left-radius: 40rpx;
			border-top-right-radius: 40rpx;
			min-height: 30vh;
			overflow: auto;
		}

		/deep/ {
			.u-drawer__scroll-view {
				max-height: 80vh;
			}
		}
	}
</style>